<template>
  <commonformdialog
    :dialogWidth="'30%'"
    :isshowDialogs="isshowDialogE"
    :dialogTitle="'审核'"
    @closetextDialog="closeDialog"
    @confirmbtn="confirmbtn"
  >
    <!-- form表单区域 -->
    <div class="formarea">
      <el-form
        ref="xlcform"
        size="medium"
        :rules="rules"
        :model="xlcforms"
        label-width="120px"
      >
        <el-row>
          <el-col :span="24">
            <el-form-item label="结果" prop="status">
              <el-radio-group v-model="xlcforms.status">
                <el-radio :label="1">通过</el-radio>
                <el-radio :label="2">驳回</el-radio>
              </el-radio-group>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="24">
            <el-form-item label="备注" prop="backInfo">
              <el-input
                type="textarea"
                placeholder="当结果为驳回时必填"
                v-model="xlcforms.backInfo"
                :rows="3"
              resize="none"
              ></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </div>
  </commonformdialog>
</template>

<script>
//弹窗外壳
import commonformdialog from "@/components/commondialog/commondialog";
import {   schoolApproval } from "@/api/institutional";
export default {
  data() {
    return {
      //训练场表单,
      xlcforms: {
        status: 1,
        backInfo: "",
      },
      rules: {
        status: [
          {
            required: true,
            trigger: "change",
          },
        ],
        backInfo: [],
      },
    };
  },
  components: {
    commonformdialog,
  },
  props: {
    //是否显示弹窗
    isshowDialogE: {
      type: Boolean,
      default: false,
      required: true,
    },
    id: '',
  status:''
  },
  watch: {
    "xlcforms.status": function (val) {
      if (val == 2) {
        this.rules.backInfo = [
          {
            required: true,
            message: "请填写备注",
            trigger: "change",
          },
        ];
      } else {
        this.rules.backInfo = [];
      }
    },
    status(val){
      this.xlcforms.status=val

    },
    id(val){
      this.xlcforms.id=val

    }
  },
  methods: {
    closeDialog() {
      //重置表单 关闭弹窗
      this.$refs["xlcform"].resetFields();
      this.$emit("closedialogE");
    },

    //确认提交表单
    async confirmbtn() {
      this.$refs["xlcform"].validate(async (valid) => {
        if (!valid) return;
        // TODO 提交表单
    
        let {id,status,backInfo} = this.xlcforms;
        let params={id,status}
        if(backInfo){
          params.backInfo=backInfo
        }
        let data = await schoolApproval(params);
        if (data.code == "0000") {
          this.$message({
            type: "success",
            message: data.msg,
          });
          //清空数据
          this.$refs["xlcform"].resetFields();
        }

        this.$emit("confirmbtnE");
      });
    },
  },
  mounted() {

  },
};
</script>

<style scoped lang='scss'>
.formtips {
  font-size: 12px;
  color: rgba(0, 0, 0, 0.4);
  margin-left: 100px;
}
</style>
